<template>
	<view>
				<view class="user">
					<image src="../../static/logo.png" @click="ToLogin"></image>
					<view class="user_information">
						<view>name</view>
						<view>number:xxx</view>
					</view>
					<view class="user_room" @click="ToUserDetail">空间 ></view>
				</view>
				<view class="fork_fan">
					<view class="forks" @click="ToForkFansDetail('left')">
						<view>3</view>
						<view>关注</view>
					</view>
					<view class="vertical_line"> | </view>
					<view class="fans" @click="ToForkFansDetail('right')">
						<view>3</view>
						<view>粉丝</view>
					</view>
				</view>
				<view class="user_attend">
					<view class="user_attend_item" v-for="item in user_attend" :key="item.id">
						<image>{{item.imgurl}}</image>
						<view>{{item.name}}</view>
					</view>
		
				</view>
				<view class="horizon_line"></view>
				<view class="detail">
					<view class="detail_item" v-for="item in detail" :key="item.id" @click="Tourl(item.Tourl)">
						<image></image>
						<view>{{item.name}}</view>
						<view class="extension">></view>
					</view>
				</view>
				<view>{{openid}}</view>
				<BottomMenu></BottomMenu>
	</view>
</template>

<script>
	import BottomMenu from "@/components/BottomMenu.vue"
	import TeamList from "@/components/TeamList.vue"
	export default {
		onLoad() {
			const db = uniCloud.database()
			var that=this
			try {
				const value = uni.getStorageSync('openid');
				if (value) {
					console.log(value);
				}
				that.openid=value
			} catch (e) {
				uni.navigateTo({
					url:'/pages/login/login'
				})
			}
			db.collection('demoTest')
			  .where('nickname == "鲸鱼睡觉会有梦吗"')
			  .get()
			  .then((res)=>{
			    console.log(res)
			  }).catch((err)=>{
			    // err.message 错误信息
			    // err.code 错误码
			  })
		},
		data() {
			return {
				openid:'',
				user_attend:[{
					id:1,
					name:"我参与的",
					imgurl:"1",
					Tourl:""
				},{
					id:2,
					name:"我发起的",
					imgurl:"2",
					Tourl:""
				},{
					id:3,
					name:"我的评论",
					imgurl:"3",
					Tourl:""
				},{
					id:4,
					name:"我的回复",
					imgurl:"4",
					Tourl:""
				}],
				detail:[{
					id:1,
					name:"分享小程序",
					imgurl:"1",
					Tourl:""
				},{
					id:2,
					name:"加入我们",
					imgurl:"3",
					Tourl:"/pages/join_us/join_us"
				},{
					id:3,
					name:"意见反馈",
					imgurl:"3",
					Tourl:""
				}]
			}
		},
		components:{
			BottomMenu:BottomMenu,
			TeamList
		},
		methods: {
			ToLogin(){
				uni.navigateTo({
					url:'/pages/login/login'
				})
			},
			ToUserDetail(){
				uni.navigateTo({
					url:"/pages/user_detail/user_detail"
				})
			},
			ToForkFansDetail(choice){
				uni.navigateTo({
					url:"/pages/user_forks_fans/user_forks_fans?choice="+choice
				})
			},
			Tourl(url){
				uni.navigateTo({
					url:url
				})
				console.log(url)
			}
		}
	}
</script>

<style>
.user{
	display: flex;
	
}
.user image{
	border-radius: 50%;
	margin-left: 20rpx;
	width: 170rpx;
	height: 170rpx;
}
.user  .user_information{
	padding: 20rpx 0 20rpx 20rpx;
	display: flex;
	flex-direction: column;
	justify-content: space-around;
}
.user   .user_room{
	 position: absolute;
	 right: 20rpx;
	 top: 50rpx;
} 
.fork_fan{
	 margin-top: 20rpx;
	 display: flex;
	 justify-content: space-around;
}
.fork_fan   .vertical_line{
	  position: absolute;
	  
}
.user_attend{
	display: flex;
	flex-direction: row;
	justify-content: space-around;
	text-align: center;
}
.user_attend image{
	border-radius: 50%;
	margin-left: 20rpx;
	width: 170rpx;
	height: 170rpx;
}
.user_attend  .user_attend_item{
	display: flex;
	flex-direction: column;
}
.horizon_line{
	height: 3rpx;
	margin-top: 20rpx;
	background-color: #424242;
}
.detail{
	display: flex;
	flex-direction: column;
	justify-content: space-around;
	margin-bottom: 100rpx;
}
.detail image{
	border-radius: 50%;
	margin-left: 20rpx;
	width: 170rpx;
	height: 170rpx;
}
.detail .detail_item{
	display: flex;
	vertical-align: middle;
}
.detail_item view{
	line-height: 170rpx;
}
.detail .detail_item .extension{
	position: absolute;
	right: 40rpx;
	
}
</style>
